<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
<%@include file="/WEB-INF/mytag.jspf"%>

<!DOCTYPE html>
<html>
<head>
<base href="<%=basePath%>">
<title>服务项目管理</title>
<script src="assets/js/serviceitem/serviceitem.js"></script>
<script type="text/javascript">
//初始化下拉框
$.ajax({
	url: "management/itemcategory/listItemcategory",
	type:"POST",
	success:function(data){
		$(data).each(function(n){
            $("<option/>").html(this.name).val(this.itemCategoryId)
            .appendTo("#itemCategoryId");
        });
	}
});
</script>
</head>
<body>
	<ol class="am-breadcrumb am-breadcrumb-slash am-padding" style="margin-bottom: 0px;">
		<li><a href="management/index">首页</a></li>
		<li><a href="management/serviceitem/index">服务项目管理</a></li>
		<li class="am-active">新增</li>
	</ol>
	<div class="am-g">
		<div class="am-u-md-12">
			<form class="am-form am-form-horizontal" id="form" name="form" method="post"
				action="management/serviceitem/save">
				<div class="am-tabs am-margin" data-am-tabs="{noSwipe: 1}">
					<ul class="am-tabs-nav am-nav am-nav-tabs">
						<li class="am-active"><a href="#tab1">基本信息</a></li>
						<li><a href="#tab2">服务定价</a></li>
						<li><a href="#tab3">选择角色</a></li>
					</ul>
					<div class="am-tabs-bd">
						<div class="am-tab-panel am-fade am-in am-active" id="tab1">
							<div class="am-form-group">
								<label class="am-u-sm-2 am-form-label">项目编号</label>
								<div class="am-u-md-4 am-u-end">
									<input type="text" id="no" name="no" class="am-form-field am-input-sm" maxlength="30">
								</div>
							</div>
							<div class="am-form-group">
								<label class="am-u-sm-2 am-form-label">项目名称</label>
								<div class="am-u-md-4 am-u-end">
									<input type="text" id="name" name="name" class="am-form-field am-input-sm" maxlength="20">
								</div>
							</div>
							<div class="am-form-group">
								<label class="am-u-sm-2 am-form-label">项目类别</label>
								<div class="am-u-md-4 am-u-end">
									<select id="itemCategoryId" name="itemCategoryId" >
											
									</select>
								</div>
							</div>
						</div>

						<div class="am-tab-panel am-fade" id="tab2">
							<div class="am-form-group">
								<div class="am-u-sm-4 am-u-md-2 am-text-right">门店等级</div>
								<div class="am-u-sm-4 am-u-md-2">会员价</div>
								<div class="am-u-md-2 am-u-end">非会员价</div>
							</div>
							<c:forEach items="${shopGrades}" var="s" varStatus="status">
     						<div class="am-form-group" style="height:35px">
								<label class="am-u-sm-4 am-u-md-2 am-form-label">
									<input type="checkbox" id="gradeNeedCk_${status.index}" class="needCkCls" title="请选择门店等级">
									${s.name}
									<input name="priceList[${status.index}].shopGradeId" type="hidden" value="${s.shopGradeId}" disabled="disabled">
								</label>
								<div class="am-u-sm-4 am-u-md-2">
									<input type="text" name="priceList[${status.index}].vipPrice" class="required isPriceOne am-input-sm" placeholder="请输入会员价" disabled="disabled">
								</div>
								<div class="am-u-md-2 am-u-end">
									<input type="text" name="priceList[${status.index}].noVipPrice" class="required isPriceOne am-input-sm" placeholder="请输入非会员价" disabled="disabled">
								</div>
							</div>
     						</c:forEach>
						</div>
						
						<div class="am-tab-panel am-fade" id="tab3">
							<div class="am-form-group">
								<div class="am-u-sm-4 am-u-md-2 am-text-right">角色</div>
								<div class="am-u-sm-4 am-u-md-2">抽成方式</div>
								<div class="am-u-md-4 am-u-end">抽成金额(元)\抽成比例（%）</div>
							</div>
							<c:forEach items="${roles}" var="r" varStatus="status">
     						<div class="am-form-group" style="height:35px">
								<label class="am-u-sm-4 am-u-md-2 am-form-label">
									<input type="checkbox" id="roleNeedCk_${status.index}" class="needCkCls2" title="请选择角色" checked="checked" disabled="disabled">
									${r.name}
									<input name="roleRelaList[${status.index}].roleId" type="hidden" value="${r.roleId}">
								</label>
								<c:if test="${r.roleId=='XFS'}">
								<div class="am-u-sm-4 am-u-md-2">
									<select class="commisionSelCls">
										<option value="amount">按金额抽成</option>
										<option value="ratio">按比例抽成</option>
									</select>
								</div>
								<div class="am-u-md-4 am-u-end">
									<input type="text" name="roleRelaList[${status.index}].commisionAmount" class="required isPriceOne am-input-sm" placeholder="请输入抽成金额">
								</div>
								</c:if>
								<c:if test="${r.roleId=='RTS'}">
								<div class="am-u-sm-4 am-u-md-2">
									<select class="commisionSelCls">
										<option value="ratio">按比例抽成</option>
										<option value="amount">按金额抽成</option>
									</select>
								</div>
								<div class="am-u-md-4 am-u-end">
									<input type="text" name="roleRelaList[${status.index}].commisionRatio" class="required isRatio am-input-sm" placeholder="请输入抽成比例">
								</div>
								</c:if>
							</div>
     						</c:forEach>
						</div>
					</div>
				</div>
				<div class="am-margin">
					<button class="am-btn am-btn-primary am-btn-xs" type="submit">
						<span class="am-icon-check"></span> 保存
					</button>
					<a href="javascript:;" onClick="javascript:history.back(-1);"
						class="am-btn am-btn-primary am-btn-xs"><span
						class="am-icon-times"></span> 取消</a>
				</div>
			</form>
		</div>
	</div>
</body>
</html>
